<template>
  <el-dialog
    :visible.sync="visible"
    :title="isAdd ? '添加策略' : '编辑策略'"
    :close-on-click-modal="false"
  >
    <el-form
      :model="dataForm"
      :rules="rules"
      ref="dataForm"
      label-width="130px"
    >
      <el-form-item prop="strategyName" label="选择策略：">
        <el-input
          v-model="dataForm.strategyName"
          placeholder="请选择策略"
          clearable
          readonly
          style="width: 280px"
        >
          <el-button
            slot="append"
            icon="el-icon-search"
            @click="relationStrategyHandle"
          ></el-button>
        </el-input>
      </el-form-item>
      <el-form-item prop="initialMoney" label="投资金额：">
        <el-input-number
          v-model="dataForm.initialMoney"
          placeholder="请输入投资金额"
          :controls="false"
          :precision="2"
          style="width: 160px"
        ></el-input-number>
        万元
      </el-form-item>
      <el-form-item label="进入日期：" prop="enterTime">
        <el-date-picker
          v-model="dataForm.enterTime"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="进入日期"
        >
        </el-date-picker>
      </el-form-item>
    </el-form>

    <div slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button
        type="primary"
        @click="localSet ? localSubmit() : submitHandle()"
        >提交</el-button
      >
    </div>

    <strategyOpen
      v-if="strategyVisible"
      ref="strategyOpen"
      :userId="userId"
      @selctInvestName="selctInvestNameHandle"
    ></strategyOpen>
  </el-dialog>
</template>

<script>
import {
  addOrUpdateClassifyStrategyExy,
  findClassifyStrategyExtById,
} from "@/api/groupManage";
import strategyOpen from "@/views/afterManage/afterInvest/relation/strategyOpen.vue";
import { deepClone } from "@/utils";

export default {
  name: "GroupManageRelationStrategyAddOpen",
  components: { strategyOpen },
  props: {
    userId: String | Number,
    localSet: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      visible: false,
      strategyVisible: false,
      isAdd: true,
      dataForm: {
        classifyId: "",
        strategyId: "",
        strategyName: "",
        initialMoney: undefined,
        enterTime: "",
      },
      rules: {
        strategyName: [
          { required: true, message: "策略必填", trigger: "change" },
        ],
        initialMoney: [
          { required: true, message: "投资金额必填", trigger: "blur" },
        ],
      },
    };
  },
  methods: {
    // 初始化
    init(classifyId, strategyId) {
      this.visible = true;
      this.$nextTick(() => {
        this.$refs["dataForm"].resetFields();
        this.dataForm = {
          classifyId: "",
          strategyId: "",
          strategyName: "",
          initialMoney: undefined,
          enterTime: "",
        };
        this.isAdd = true;
        this.dataForm.classifyId = classifyId;
        if (strategyId) {
          this.isAdd = false;
          this.findClassifyStrategyExtById(strategyId);
        }
      });
    },
    relationStrategyHandle() {
      this.strategyVisible = true;
      this.$nextTick(() => {
        this.$refs.strategyOpen.init();
      });
    },
    selctInvestNameHandle(strategyInfoVo) {
      this.dataForm.strategyId = strategyInfoVo.strategyId;
      this.dataForm.strategyName = strategyInfoVo.strategyName;
    },
    findClassifyStrategyExtById(strategyId) {
      findClassifyStrategyExtById({
        strategyId,
        classifyId: this.dataForm.classifyId,
      }).then((res) => {
        this.dataForm = res.body;
      });
    },
    submitHandle() {
      this.$refs["dataForm"].validate((valid) => {
        if (valid) {
          addOrUpdateClassifyStrategyExy({
            ...this.dataForm,
          }).then((res) => {
            if (res.code == 0) {
              this.$notify({
                message: res.msg,
                type: "success",
                duration: 2000,
              });
              this.$emit("addStrategyName");
              this.visible = false;
            }
          });
        }
      });
    },
    localSubmit() {
      this.visible = false;
      const res = deepClone(this.dataForm);
      this.$emit("closeOpen", res);
    },
  },
};
</script>

<style lang="scss" scoped>
.relationStrategy-page {
  padding-top: 20px;
  .card {
    margin-top: 20px;
    padding: 20px;
    background: #eee;
    ::v-deep .el-form-item {
      margin-bottom: 0;
    }
  }
  .footer {
    margin-top: 40px;
    text-align: center;
  }
}
</style>
